<style type="text/css">
    .filter .item {
        width: 200px;
    }
</style>
<div class="filter">
    <div class="f1 item">
        <input type="number" class="am-form-field" placeholder="请输入群号" />
    </div>
    <div class="button item">
        <button type="button" class="am-btn am-btn-primary btn-name">查看</button>
    </div>
    <div class="clear"></div>
</div>

<table class="am-table group_info">
    <thead>
        <tr>
            <th>项目</th>
            <th>信息</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

<script>
    var globalFee = 0;
    Classify.query("group.fee", "default", false, 0, function(v) {
        globalFee = v;
    });

    // 填充群数据
    function fill_group_info(data) {
        var table = $(".group_info tbody");
        table.empty();
        var tr = $("<tr><th>id</th></tr>");
        tr.append("<td>" + data.id + "</td>");
        table.append(tr);

        var tr = $("<tr><th>群名称</th></tr>");
        tr.append("<td>" + data.name + "</td>");
        table.append(tr);

        var tr = $("<tr><th>群号</th></tr>");
        tr.append("<td>" + data.code + "</td>");
        table.append(tr);

        var tr = $("<tr><th>成员数</th></tr>");
        tr.append("<td>" + data.member + "</td>");
        table.append(tr);

        // 获取群主的信息
        var table2 = $('<div class="am-g"></div>');
        var tr = $("<tr><th>群主</th></tr>");
        var td = $("<td></td>"); td.append(table2); tr.append(td);
        for (var i in data.list) {
            if (data.list[i].user.id == data.owner) {
                var user = data.list[i].user;
                table2.append('<div class="am-u-sm-2">微信账号</div>');
                table2.append('<div class="am-u-sm-10">' + user.nick + '</div>');

                table2.append('<div class="am-u-sm-2">头像</div>');
                table2.append('<div class="am-u-sm-10">' + '<img src="' + user.portrait + '" width="80px"/>' + '</div>');

                table2.append('<div class="am-u-sm-2">菠菜号</div>');
                table2.append('<div class="am-u-sm-10">' + user.code + '</div>');

                table2.append('<div class="am-u-sm-2">手机</div>');
                table2.append('<div class="am-u-sm-10">' + (user.mobile || '') + '</div>');
                break;
            }
        }
        table.append(tr);

        var tr = $("<tr><th>彩种</th></tr>");
        var td = $("<td></td>");
        var select = $("<select data-am-selected></select>");
        var games = get_game_list(true);
        var l = '<option value="__v__">__name__</option>';
        select.append("<option value='none'>普通群</option>");
        for (var i in games) {
            var option = l.replace(/__v__/, games[i]);
            option = option.replace(/__name__/, get_game_display_name(games[i]));
            select.append(option);
        }
        td.append(select);
        td.append('<button class="btn-game">保存</button>');
        tr.append(td);
        table.append(tr);

        $(".group_info select").val(data.lottery || 'none');
        $(".group_info select").trigger('changed.selected.amui');
        $("button.btn-game").click(function() {
            var game = $(".group_info select").val();
            if (game == 'none') game = '';
            if (game == data.lottery) {
                alert2("未发生变化，无须保存！", true);
                return;
            }

            startLoading();
            CMD.bind_group_lottery(data.id, game, function() {
                stopLoading();
                alert2("彩种绑定完成！");
            });
        });

        var tr = $("<tr><th>人数上限</th></tr>");
        var td = $("<td></td>");
        td.append('<input type="number" class="limit"/>');
        td.append('<button class="btn-limit">保存</button>');
        tr.append(td);
        table.append(tr);

        $("input.limit").val(data.limit);
        $("button.btn-limit").click(function() {
            var v = $("input.limit").val().trim();
            if (v == '' || parseInt(v) <= 0) {
                alert2("数量错误！", true);
                return;
            }
            startLoading();
            CMD.set_group_limit(data.id, v, function() {
                stopLoading();
                alert2("保存完毕！");
            })
        });

        var tr = $("<tr><th>抽佣比例</th></tr>");
        var td = $("<td></td>");
        td.append('<input type="number" class="fee"/>');
        td.append('<button class="btn-fee">保存</button>');
        tr.append(td);
        table.append(tr);

        $("input.fee").val(data.fee == '' ? globalFee : data.fee);
        $("button.btn-fee").click(function() {
            var v = $("input.fee").val().trim();
            if (v == '' || (v * 1) <= 0) {
                alert2("数量错误！", true);
                return;
            }
            startLoading();
            CMD.group_set_fee(data.id, v, function() {
                stopLoading();
                alert2("保存完毕！");
            })
        });
    }

    $(".filter button").click(function() {
        var id = $(".filter .f1 input").val().trim();
        if (id == '') return;
        id = parseInt(id);
        if (id < 1) return;

        startLoading();
        CMD.find_group_by_code(id, function(r) {
            stopLoading();
            CMD.query_group_members(r.id, function(r2) {
                r.list = r2;
                fill_group_info(r);
            });
        }, function(r) {
            stopLoading();
            alert2("群组不存在！");
        });
    });
</script>
   